<template>
  <div class="content">
    <h1>我是App.vue父组件</h1>
    <div>isShow: {{ isShow }}</div>
    <div>text: {{ text }}</div>
    <div>
      <button class="switch" @click="isShow = !isShow">开关</button>
    </div>
    <hr>
    <vModelVue v-model:textVal.isBt="text" v-model="isShow"></vModelVue>
  </div>
</template>

<script setup lang="ts">
import {ref} from "vue"
import vModelVue from "./components/vModelVue.vue"

let isShow = ref<Boolean>(true)
let text = ref<String>("我是父组件的text")

</script>

<style lang="less" scoped>
.content {
  text-align: left;
}
h1 {
  line-height: 2.0;
}
.switch {
  display: inline-block;
  padding: 10px 24px;
  margin: 10px 0;
  background-color: #fff;
  border: 1px solid #ccc;
}
</style>